<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link href="../../favicon.ico" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<link rel="stylesheet" href="css/swiper.min.css" />
		<link rel="stylesheet" href="css/video-js.min.css" />
		<link rel="stylesheet" href="css/newbase.css" />
		<link rel="stylesheet" href="css/newstyle.css" />
		<link rel="stylesheet" href="css/neworder.css" />
		<link rel="stylesheet" href="css/iconfont.css" />
		<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" src="js/swiper.jquery.min.js"></script>
		<script type="text/javascript" src="js/newlayer/layer.js"></script>
		<script type="text/javascript" src="js/icheck.min.js"></script>
		<script type="text/javascript" src="js/My97DatePicker/WdatePicker.js"></script>
		<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=0tqnGcviGS2hQWUWG7p6kI4A43M8tnF9&s=1"></script>
		<script type="text/javascript" src="https://api.map.baidu.com/library/CurveLine/1.5/src/CurveLine.min.js"></script>
		<script type="text/javascript" src="js/jquery.placeholder.min.js"></script>
		<link rel="stylesheet" href="js/select/skin/selectordie.css" />
		<link rel="stylesheet" href="js/select/skin/selectordie_theme_05.css" />
		<script type="text/javascript" src="js/select/selectordie.min.js"></script>
		<script type="text/javascript" src="js/newbase.js"></script>
		<script type="text/javascript" src="js/newLib.js"></script>
		<style>
			.myplaceholder {
				color: #999 !important;
			}
			
			.business-list .item h5 {
				-webkit-border-radius: 50%;
			}
			
			.uuBusi .infos-box {
				z-index: 8;
			}
		</style>
		<!--[if lt IE 8]>
        <style>
          .uuBusi .ucard .tag{ width: 82%;}
          .uuBusi .ucard .tag.category{
             padding-bottom:20px;
          }
        </style>
    <![endif]-->
		<!--[if lte IE 8]>
    <style>
        .secNav .business-list .item.active h5{
            background:transparent;
            border-color:transparent;
        }
    </style>
    <![endif]-->
	</head>

	<body class="uu-replace-body">

		<div class="navigation animated">
			<script type="text/javascript" src="https://api.map.baidu.com/api?ak=dZjnRr2t8nBpGswyCB731AFD&v=2.0&s=1"></script>
			<div id="allmap" style="display:none;"></div>
			<div class="nav-wrap">
				<h1 class="logo">
            <a href="javascript:;"><img src="images/UU-logo.png" alt="uu-logo" height="75px"></a>
        </h1>
				<div class="nav">
					<ul class="nav-list clearfix">
						<li>
							<a href="index.html" title="首页">首页</a>
						</li>
						<li>
							<a href="order_taking.html" title="订单大厅">订单大厅</a>
						</li>
						<li class="active">
							<a href="buy.html" title="在线下单">在线下单</a>
						</li>
						<li>
							<a href="myOrder.html" title="我的订单">我的订单</a>
						</li>

					</ul>
					<div style="clear:both;"></div>
				</div>
				<div class="button-group">
					<ul class="button-list welcome" id="userinfo">
						<li>
							<a href="login.html" class="port fl"><img src="images/port.png" width="22" height="22" style="margin-right: 10px;" />登录</a>
						</li>
						<li style="display: none;">
							<p class="username fl">欢迎您，<span id="userMobile"></span>
							</p>
							<a class="loginout" href="javascript:order.loginOut()">退出</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="uu-replace-main clearfix">
			<div class="order-nav">
				<!--四个功能样式-->
				<div class="secNav">
					<div class="business-list">
						<a href="buy.html" title="帮我买">
							<div class="item">
								<h5><i class="iconfont">&#xe606;</i></h5>
								<p>帮我买</p>
							</div>
						</a>
						<a href="Send.html" title="帮我送">
							<div class="item">
								<h5><i class="iconfont">&#xe601;</i></h5>
								<p>帮我送</p>
							</div>
						</a>
						<a href="Take.html" title="帮我取">
							<div class="item active">
								<h5><i class="iconfont">&#xe600;</i></h5>
								<p>帮我取</p>
								<!-- <span class="order-sj"></span> -->
							</div>
						</a>
						<a href="TakeOrder.html" title="其他服务">
							<div class="item">
								<h5><i class="iconfont">&#xe607;</i></h5>
								<p>其他服务</p>
							</div>
						</a>
					</div>
				</div>
			</div>
			<!-- </div> -->
			<div class="order-form">
				<div>
					<!--form区域-->
					<form action="#" method="post">
						<div class="uuBusi">
							<div class="infos-box infos-box1" style="z-index: 9;">
								<div class="ucard" style="margin-bottom:0;">
									<label>物品类型</label>
									<div class="tag category" id="sendType">
										<a href="javascript:;" data-desc="快递" data-id="489" class="selected">快递</a>
										<a href="javascript:;" data-desc="美食" data-id="487">美食</a>
										<a href="javascript:;" data-desc="文件" data-id="490">文件</a>
										<a href="javascript:;" data-desc="蛋糕" data-id="486">蛋糕</a>
										<a href="javascript:;" data-desc="鲜花" data-id="491">鲜花</a>
										<a href="javascript:;" data-desc="钥匙" data-id="492">钥匙</a>
										<a href="javascript:;" data-desc="手机" data-id="489">手机</a>
										<a href="javascript:;" data-desc="其他" data-id="488" >其他</a>
									</div>
								</div>
								<div class="ucard">
									<label>取货地址</label>
									<div class="tag" data-address-y="" data-address-x="">
										<input type="text" autocomplete="off" class="inp address-infos w86 required" name="startaddress" id="startaddress" value="" placeholder="请填写取货地址" title="取货地址" />
									</div>
								</div>
								<div class="ucard" style="padding-bottom:30px;">
									<label>取货电话</label>
									<div class="tag">
										<input type="tel" autocomplete="off" maxlength="11" class="inp" name="starttel" id="startphone" placeholder="请输入取货人手机号码" style="width: 32%">
										<span class="msg msg5">必填!</span>
										<span class="tel msg msg6">手机号码格式不正确!</span>
										<input type="text" autocomplete="off" class="inp" name="startname" id="startname" placeholder="请输入取货人姓名" style="width: 24.6%; margin-left: 10px;">
										<span class="msg msg7">必填!</span>
									</div>
								</div>
							</div>

							<div class="infos-box  infos-box2" style="padding-bottom: 10px;">
								<div class="ucard">
									<label>收货地址</label>
									<div class="tag" data-address-y="" data-address-x="">
										<input type="text" autocomplete="off" class="inp address-infos w86" name="endaddress" id="endaddress" value="" placeholder="请填写收货地址" title="收货地址" />
									</div>
								</div>
								<div class="ucard">
									<label>收货电话</label>
									<div class="tag">
										<input type="tel" autocomplete="off" maxlength="11" class="inp" name="endtel" id="endphone" placeholder="请输入收货人手机号码" style="width: 32%">
										<span class="msg msg5">必填!</span>
										<span class="tel msg msg6">手机号码格式不正确!</span>
										<input type="text" autocomplete="off"  class="inp" name="endname" id="endname"  placeholder="请输入收货人姓名" style="width: 24.6%; margin-left: 10px;">
										<span class="msg msg7">必填!</span>
									</div>
								</div>
								<!-- <div class="line-bar"></div> -->
							</div>
							<div class="infos-box infos-box3" style="z-index: 7;">
								<div class="ucard" style="margin-bottom: 0;">
									<div class="ucard" style="height: 96px;">
										<label>备注信息</label>
										<div class="tag" style="padding-bottom:20px;position:relative;">
											<textarea id="note" autocomplete="off" class="inp w100 textarea-large maxText" type="text" placeholder="请填写物品具体信息"></textarea>
											<span style="position:absolute;font-size:12px;color:#bbbbbb;right:15px;bottom:18px;z-index:10;">最多200字</span>
										</div>
									</div>
									<div class="ucard" style="line-height:40px;">
										<label>取货时间</label>
										<div class="tag special help-input send-input" id="timeChoice">
											<select name="" id="sendTime">
												<option value="立即取货" selected="selected">立即取货</option>
												<option value="预约时间，可协商">预约时间，可协商</option>
											</select>
										</div>
									</div>
									<div class="ucard" style="line-height:40px;">
										<label>接单员性别</label>
										<div class="tag special help-input" id="genderChoice">
											<select name="" id="corridorGender">
												<option value="不限" selected="selected">不限</option>
												<option value="男">男</option>
												<option value="女">女</option>
											</select>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="uuPay" style="z-index:6;">
							<div class="infos-box infos-box4" style="margin-top: 0; padding-bottom: 30px;">
									<div class="ucard">
										<div class="tag" style="width: 100%;">
											<label>订单价格</label>
											<input type="tel" id="price" maxlength="11" autocomplete="off" class="inp" style="width: 694px;" placeholder="请输入订单价格" />
										</div>
									</div>

									<div class="ucard" style="margin-bottom: 0;margin-left: 30%;">
										<input type="button" name="pay-sub" class="sub pay-sub" value="确认订单" id="confirmBtn" />
									</div>

								</div>
						</div>
						<script>
							if(window.location.pathname.indexOf('Send') > -1 || window.location.pathname.indexOf('Take.html') > -1) {
								document.getElementById('marqueeTip').style.opacity = 1;
							}
						</script>
					</form>
				</div>
			</div>
		</div>

		<style>
			.tangram-suggestion table tr td {
				height: 40px;
				line-height: 40px;
			}
		</style>
	</body>
	<script>
        $(document).ready(function() {
            $("div#sendType").children("a").click(function() {
                $("div#sendType").children("a").removeClass("selected");
                $(this).addClass("selected");
                $("#note").attr("placeholder", $(this).attr("data-desc"));
            });
        });
        $(function () {

            $("#confirmBtn").click(function () {
                var title = "取"+ $("#sendType").find("a[class='selected']").eq(0).text();
                var goodsType= $("#sendType").find("a[class='selected']").eq(0).attr("data-id");
                var sendAddress = $("#startaddress").val();
                if (sendAddress == ""){alert("请填写取货地址");return;}
                var sendPhone = $("#startphone").val();
                if (sendPhone == ""){alert("请填写取货人手机号码");return;}
                var reg = /^1[34578][0-9]{9}$/; //验证规则
                if (!reg.test(sendPhone)){
                    alert("取货人的手机号码格式不正确");return;
                }
                var sendPepole = $("#startname").val();
                if (sendPepole == ""){alert("请填写取货人");return;}

                var receivedAddress = $("#endaddress").val();
                if (receivedAddress == ""){alert("收货地址不能为空");return;}
                var receivedPepole = $("#endname").val();
                if (receivedPepole ==""){alert("请填写收货人");return;}
                var receivedPhone = $("#endphone").val();
                if (receivedPhone == ""){alert("请填写收货人联系电话");return;}
                var reg = /^1[34578][0-9]{9}$/; //验证规则
                if (!reg.test(receivedPhone)){
                    alert("收货人的手机号码格式不正确");return;
                }
                var remark = $("#note").val();
                if (remark == ""){alert("请填写你的备注信息");return;}
                var sendDate = $("#sendTime").val();
                var corridorGender = $("#corridorGender").val();
                var prcie = $("#price").val();
                if(prcie == ""){alert("请填写你的订单价格")}
                console.log("receivedAddress:"+receivedAddress);
                console.log("receivedPepole:"+receivedPepole);
                console.log("sendAddresss:"+sendAddress);
                console.log("remark:"+remark);
                console.log("sendDate:"+sendDate);
                console.log("corridorGender:"+corridorGender);
                console.log("prcie:"+prcie);

                $.ajax({
                    url:"/order/add",
                    dataType:"json",
                    type:"post",
                    data:{
                        "oType":3,
                        "price":prcie,
                        "title":title,
                        "remark":remark,
                        "sendAddress":sendAddress,
                        "sendPhone":sendPhone,
                        "sendPepole":sendPepole,
                        "corridorGender":corridorGender,
                        "goodsType":goodsType,
                        "receivedPepole":receivedPepole,
                        "receivedPhone":receivedPhone,
                        "receivedAddress":receivedAddress,
                        "sendDate":sendDate,
                    },
                    success:function (data) {
                        alert(data.msg);
                    }
                })
            })
        })
	</script>
</html>